// comps/uploadImage/index.js
Component({
  /**
   * 组件的属性列表
   */
  properties: {
    img_num_max: { //可以上传图片的数量，最大为9
      type: Number,
      value: 1
    },
    img_type: { //图片类型
      type: Object,
      value: []
    },
    img_path: { //图片上传的地址(abc/123)：包含地址和文件名称，不含扩展名，统一扩展名为.jpg
      type: String,
      value: ''
    },
    img_size_max: { //图片的大小（kb）
      type: Number,
      value: 300
    },
    img_width: { //图片的宽度（px））
      type: Number,
      value: 300
    },
    img_height: { //图片的高度（px））
      type: Number,
      value: 300
    },
  },

  /**
   * 组件的初始数据
   */
  data: {},

  /**
   * 组件的方法列表
   */
  methods: {
    /**
     * 图片文件的上传
     * ==============
     * 1、判断格式（符合规定格式）
     * 2、判断大小（不超过规定大小）
     * 3、判断尺寸（等于规定长和宽）
     * 4、上传 
     * */
    uploadImage(event) {
      let that = this;
      let ed = event.currentTarget.dataset; //用户端传递的数据集（小写）
      console.log('用户端传递的数据集：', ed);

      let chooseNum = 0; //已选择的数量

      (async () => {
        //选择图片
        let chImg = await that.chooseImage(ed.img_num_max);
        console.log(chImg);

        // tfp为图片地址数组，可以作为img标签的src属性显示图片
        let tfp = chImg.tempFilePaths;
        chooseNum = tfp.length;

        //在图片展示区构造图片位
        that.setData({
          index: chooseNum
        });

        //遍历所选择的图片
        tfp.forEach((item, index) => {
          //检测图片格式
          let imgType = that.checkImageType(ed.img_type, item);
          //图片大小(kb)
          let imgSize = Math.round(chImg.tempFiles[index].size / 1024); //Math.round()四舍五入  
          if (imgType.isOk) { //图片类型合法
            if (imgSize > ed.img_size_max) { //图片大小超出规定值
              console.log('图片大小超出规定值');
              that.setData({ //未上传的图片位显示默认图片
                ['imgsrc[' + index + ']']: "/image/picture.png",
                ['imgMessage[' + index + ']']: "大小超出规定值"
              })
            } else { //图片大小合法
              (async () => {
                let imgMse = await that.getImageMessage(ed.img_width, ed.img_height, item);
                console.log('图片信息：', imgMse);
                if (imgMse.isOk) { //图片长宽符合规定。必须完全一致
                  console.log('图片长宽符合规定')
                  //上传路径
                  let cloudPath = ed.img_path + '_' + index + '.' + imgMse.type;
                  //此时图片类型、大小、尺寸都符合规定。开始上传图片
                  await that.uploadFile(item, cloudPath, index);
                } else { //图片长宽不符合规定
                  console.log('图片长宽不符合规定');
                  that.setData({ //未上传的图片位显示默认图片
                    ['imgsrc[' + index + ']']: "/image/picture.png",
                    ['imgMessage[' + index + ']']: "尺寸不合适"
                  })
                }
              })();
            }
          } else { //图片类型不合法            
            console.log('图片类型不合适');
            that.setData({ //未上传的图片位显示默认图片
              ['imgsrc[' + index + ']']: "/image/picture.png",
              ['imgMessage[' + index + ']']: "类型不合适"
            })
          }
        })
      })();
    },

    /**
     * 图片文件的上传
     * ==============
     * 1、先判断文件的格式：png，jpg，jpeg，gif
     * 2、由于微信支持jpg格式压缩，所以不是jpg时，判断大小不超过500k
     * 3、jpg格式如果大小超出500k，压缩
     * 4、开始上传 
     * */
    uploadImage2(event) {
      let that = this;
      let cloudImgPath = event.currentTarget.dataset.imgpath; //图片在云存储中的位置(路径和文件名，不包含扩展名)
      let imgnum = event.currentTarget.dataset.imgnum; //允许上传的图片最大数量
      let imgsizeMax = event.currentTarget.dataset.imgsize;
      let imgtype = event.currentTarget.dataset.imgtype;

      let chooseNum = 0; //选择的数量
      // 让用户选择一张图片
      wx.chooseImage({
        count: imgnum, //上传数量
        sizeType: ['original', 'compressed'], //原图或缩略图
        sourceType: ['album', 'camera'], //相册或者拍照
        success(res) {
          // tempFilePath可以作为img标签的src属性显示图片
          let tempFilePaths = res.tempFilePaths;
          chooseNum = tempFilePaths.length;

          that.setData({ //需要构造的图片位
            index: chooseNum
          })

          //遍历所选择的图片
          tempFilePaths.forEach((item, index) => {
            let cloudPath = cloudImgPath + '_' + index + '.jpg';
            //检测图片格式
            let imgType = that.checkImageType(imgtype, item);

            if (imgType.isImg) { //图片类型合法
              //判断大小res.tempFiles[0]
              let imgsize = Math.round(res.tempFiles[index].size / 1024); //Math.round()四舍五入
              if (imgType.type == '.jpg') {
                //压缩
                let q = 100; //压缩比。默认100（即不压缩）
                if (imgsize > 3000) {
                  q = 20;
                } else if (imgsize > 2000) {
                  q = 40;
                } else if (imgsize > 1000) {
                  q = 70;
                } else if (imgsize > 500) {
                  q = 80;
                }

                if (q < 100) { //需要压缩。压缩后上传
                  //压缩图片
                  wx.compressImage({
                    src: item, // 图片路径
                    quality: q // 压缩质量
                  }).then(res => {
                    (async () => {
                      await that.uploadFile(res.tempFilePath, cloudPath, index);
                    })();
                  })
                } else { //不需要压缩。直接上传
                  (async () => {
                    await that.uploadFile(item, cloudPath, index);
                  })();
                }

              } else { //非jpg格式。大小不超过特定值
                if (imgsize > imgsizeMax) { //超过
                  let str = '';
                  if (chooseNum > 1) {
                    str = '第' + (index + 1) + '张';
                  }
                  wx.showModal({
                    title: '提示',
                    content: str + '图片不是jpg格式，最大不能超过' + imgsizeMax + 'k',
                    confirmText: '知道了',
                    showCancel: false,
                    success: function (res) {
                      (async () => {
                        await new Promise(resolve => {
                          if (res.confirm) { //点完知道了，再继续执行
                            resolve();
                          }
                        });
                      })();
                      that.setData({ //未上传的图片位显示默认图片
                        ['imgsrc[' + index + ']']: "/image/picture.png"
                      })
                    }
                  })
                  //return;
                } else { //不超过500k
                  //上传图片
                  (async () => {
                    await that.uploadFile(item, cloudPath, index);
                  })();
                }
              }
            } else { //图片类型不合法            
              let str = '';
              if (chooseNum > 1) {
                str = '第' + (index + 1) + '张';
              }
              wx.showModal({
                title: '提示',
                content: str + '图片格式不正确',
                confirmText: '知道了',
                showCancel: false,
                success: function (res) {
                  (async () => {
                    await new Promise(resolve => {
                      if (res.confirm) { //点完知道了，再继续执行
                        resolve();
                      }
                    });
                  })();
                  that.setData({ //未上传的图片位显示默认图片
                    ['imgsrc[' + index + ']']: "/image/picture.png"
                  })
                }
              })
            }
          })
        }
      })
    },
    //选择图片
    //输出promise
    chooseImage(count) {
      let p = new Promise((resolve, reject) => {
        wx.chooseImage({
          count: count, //数量
          sizeType: ['original', 'compressed'], //原图或缩略图
          sourceType: ['album', 'camera'], //相册或者拍照
          success(res) {
            resolve(res);
          }
        })
      })
      return p;
    },
    /**
     * 检测图片格式
     * -----------------------
     * imgType  规定的图片类型 (数组)
     * imagePath  图片地址
     */
    checkImageType(imgType, imagePath) {
      //检测图片格式
      let reg = /(\.png|\.jpg|\.jpeg|\.gif)$/i; //正则表达式，不分区大小写。默认值
      if (imgType && imgType.length > 0) {
        let a = '';
        imgType.forEach((t, index) => {
          if (index == 0) {
            a = '\\' + t;
          } else {
            a = a + '|\\' + t;
          }
        })
        reg = new RegExp('(' + a + ')$', 'i');
      }

      let isOk = reg.test(imagePath); //是否是合法图片
      let it = '';
      if (reg.exec(imagePath)) {
        it = reg.exec(imagePath)[0].toLocaleLowerCase(); //图片类型，转为小写
      }
      let result = {
        isOk: isOk,
        type: it
      }
      return result;
    },
    /**
     * 得到图片的宽度和高度，类型
     * ------------------------
     * width,height规定的尺寸
     * imagePath图片地址
     */
    getImageMessage(width, height, imagePath) {
      let p = new Promise((resolve, reject) => {
        wx.getImageInfo({
          src: imagePath, //图片地址
          success(res) {
            //判断尺寸是否符合规定     
            let isOk = true;
            if (res.width != width || res.height != height) {
              isOk = false;
            }
            let result = {
              isOk: isOk,
              width: res.width,
              height: res.height,
              type: res.type
            }
            resolve(result);
          },
          fail(res) {
            console.log('获取图片尺寸失败', res);
            let result = {
              isOk: false,
              width: 0,
              height: 0,
              type: ''
            }
            reject(result);
          }
        })
      })
      return p;
    },
    //上传文件
    uploadFile(filePath, cloudPath, index) {
      let that = this;
      // 将图片上传至云存储空间
      var uploadTask = wx.cloud.uploadFile({
        // 指定上传到的云路径
        cloudPath: cloudPath,
        // 指定要上传的文件的小程序临时文件路径
        filePath: filePath, // 文件路径
        success: res => {
          console.log('上传成功', res.fileID);
          that.setData({
            ['imgsrc[' + index + ']']: res.fileID
          })
        }
      })

      let pro = 0; //进度值
      uploadTask.onProgressUpdate((res) => {
        pro = res.progress;
        that.setData({
          ['progress[' + index + ']']: pro
        })
      })

      //当进度为100时，执行resolve()，上传结束
      let p = new Promise(resolve => {
        if (pro == 100) {
          resolve(pro);
        }
      })
      return p;

      /*  uploadTask.abort() // 取消上传任务 */
    },
  }
})